<template>
    <div id="exhibition-information">
        <div class="exhibition-info-content container">
            <div class="info-left">
                <div class="info-way">
                    <div class="info-left-title">
                        <div class="title-text">展馆介绍</div>
                    </div>
                    <div class="info-con">
                        临港开发区会展中心是临港开发区重大建设项目，集总部办公、产品展示、创意研发、教育培训、
                        会务金融、产品交易、信息交流、星级酒店八大功能于一体，着力打造“通过互联网+金融+资源
                        连接城市、链接产业”的全功能复合型云平台。该项目占地约190亩，包括数据中心、科创A座、
                        科创B座、研发展示中心和室外景观工程，总建筑面积16.2万平方米，总投资约12亿元。项目的建
                        成将促进产业集聚，带动就业，成为临港开发区经济发展新增动力，为临港开发区建成西部一流的
                        国家级经济技术开发区奠定坚实基础。
                    </div>
                </div>
                <div class="info-way">
                    <div class="info-left-title">
                        <div class="title-text">展馆照片</div>
                    </div>
                    <div class="info-con1">
                        <div class="ex-pic">
                            <div
                                class="ex-pic-box"
                                v-for="(item,index) in exPicList"
                                :key="'info'+index"
                            >
                                <img :src="'../../../assets/'+item+'.jpg'" :alt="'展馆图片'+index" />
                            </div>
                        </div>
                    </div>
                </div>
                <div class="info-way">
                    <div class="info-left-title">
                        <div class="title-text">展馆参数</div>
                    </div>
                    <div class="info-con">
                        临港开发区会展中心可展览面积28000平方米 ，展厅净高最低9米，共设5个展厅（标准展厅2个，
                        面积各10000平方米，多功能展厅3个，面积各2000平方米）、1个国际会议厅（面积2000平方米
                        最多可容纳1200人）、7个会议室、2个贵宾室、6个洽谈室，配有5语种同声传译系统、DLP高清
                        大屏、视频会议系统、会议表决系统、会议录音录像系统等先进的会议设备，同时提供专业、完善
                        的展览和会议配套服务。
                        <div class="param-title">展厅参数</div>
                        <div>
                            <p>展厅名称： A厅 </p>
                            <p>面 积：9638平方米</p>
                        </div>
                        <div class="param-hall">
                            <p>展厅名称： B厅 </p>
                            <p>面 积：1962平方米</p>
                        </div>
                        <div class="param-hall">
                            <p>展厅名称： C厅 </p>
                            <p>面 积：1962平方米</p>
                        </div>
                        <div class="param-hall">
                            <p>展厅名称： D厅 </p>
                            <p>面 积：9638平方米</p>
                        </div>
                        <div class="param-hall">
                            <p>展厅名称： E厅 </p>
                            <p>面 积：1799平方米</p>
                        </div>
                        <div class="param-hall">
                            <p>展厅名称： F厅 </p>
                            <p>面 积：1962平方米</p>
                        </div>
                    </div>
                </div>
            </div>
            <div class="info-right">
                <exhibition-center-recommended></exhibition-center-recommended>
            </div>
        </div>
    </div>
</template>

<script>
import ExhibitionCenterRecommended from "@/components/exhibitionCenterRecommended";
export default {
    name: "Exhibitioninfo",
    components: {
        ExhibitionCenterRecommended
    },
    data() {
        return {
            exPicList: [
                "servicer-provider-img3",
                "servicer-provider-img2",
                "servicer-provider-img5",
                "servicer-provider-img4",
                "servicer-provider-img6",
                "servicer-provider-img7",
                "servicer-provider-img8"
            ]
        };
    }
};
</script>
<style lang="scss" scoped>
#exhibition-information {
    .exhibition-info-content {
        margin-top: 58px;
        display: flex;
        .info-left {
            width: 898px;
            text-align: left;
            .info-way {
                .info-con {
                    padding: 22px 0 30px;
                    line-height: 27px;
                    color: #010000;
                }
                .ex-pic {
                    display: flex;
                    flex-wrap: wrap;
                    .ex-pic-box {
                        width: 33.3%;
                        margin-top: 31px;
                        display: flex;
                        align-items: center;
                        > img {
                            width: 230px;
                            border: 2px solid #fff;
                            outline: 1px solid rgba(181, 181, 181, 1);
                        }
                    }
                }
                .info-con1 {
                    padding: 5px 0 30px;
                }
                .param-title {
                    margin-top: 10px;
                    color: #c81622;
                    font-size: 20px;
                }
                .param-hall{
                    margin-top:15px;
                }
            }
            .info-left-title {
                text-align: center;
                border-bottom: 1.5px solid #c81622;
                .title-text {
                    width: 114px;
                    height: 38px;
                    line-height: 38px;
                    color: #fff;
                    font-size: 20px;
                    background-color: #c81622;
                }
            }
        }
        .info-right {
            flex: auto;
            margin: 11px 0 0 22px;
        }
    }
}
</style>
